<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"  import="java.util.*"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript">
	
function searchObject(){
	$('#tt').datagrid('load',{
		searchTen: $('#searchTen').val(),
	});
}

jQuery(function(){
	$("#searchTen").autocomplete("search/searchCTGD.jsp");
});

</script>

<script type="text/javascript">
	   
	   $(function(){  
	        $('#id_ctgd').combobox({  
	            onChange:function (newValue, oldValue){  
	                if(newValue !=null){  
	                	$('#tt').datagrid('load', {
	            			id : newValue,
	            		});
	                }  
	            }  
	        });  
	    });
	   
	   $(function(){
			$('#tt').datagrid({  
			    view: detailview,  
			    detailFormatter:function(index,row){  
			        return '<div style="padding:2px"><table id="ddv-' + index + '"></table></div>';  
			    },  
			    onExpandRow: function(index,row){  
			        $('#ddv-'+index).datagrid({  
			            url:'view/detailKhoiKienThuc.jsp?id='+row.id_khoi_kien_thuc,  
			            fitColumns:true,  
			            singleSelect:true,  
			            rownumbers:true,  
			            loadMsg:'',  
			            height:'auto',
			            columns:[[   
			                {field:'ma_mon_hoc',title:'Mã Môn'},  
			                {field:'ten_mon_hoc',title:'Tên Môn Học'},  
			                {field:'so_tc',title:'Số TC'}, 
			                {field:'so_tiet_lt',title:'Số tiết LT'} ,
			                {field:'so_tiet_th',title:'Số tiết TH'},
			                {field:'ten_nhom_mon_hoc',title:'Nhóm Môn Học'}
			            ]],  
			            onResize:function(){  
			                $('#tt').datagrid('fixDetailRowHeight',index);  
			            },  
			            onLoadSuccess:function(){  
			                setTimeout(function(){  
			                    $('#tt').datagrid('fixDetailRowHeight',index);  
			                },0);  
			            }  
			        });  
			        $('#tt').datagrid('fixDetailRowHeight',index);  
			    }  
			});
		}); 
</script>
<style type="text/css">
#fm {
	margin: 0;
	padding: 5 0px;
}

.ftitle {
	font-size: 14px;
	font-weight: bold;
	color: #000000;
	padding: 5px 0;
	margin-bottom: 10px;
	border-bottom: 1px solid #ccc;
}

.fitem {
	margin-bottom: 7px;
}

.fitem label {
	display: inline-block;
	width: 190px;
}

.fitem input {
	display: inline-block;
	width: 290px;
	background: none repeat scroll 0 0 #FFFFFF;
    border: 1px solid #888888;
    border-radius: 5px 5px 5px 5px;
    color: #222222;
    margin: 0 5px 0 0;
    padding: 3px 4px;
}
</style>
</head>
<body>
	<table id="tt" class="easyui-datagrid" 
			style="width:100%;height:737px"
			url="KhoiKienThucServlet"
			title=":: KHỐI KIẾN THỨC" toolbar="#tb"
			rownumbers="true" pagination="true" singleSelect="false" fitColumns="true">
		<thead>
			<tr>
				<th field="ck" checkbox="true"></th>
				<th field="ten">Tên Khối Kiến Thức</th>
				<th field="so_tc_bb">Số TC Bắc Buộc</th>
				<th field="so_tc_tc">Số TC Tự Chọn</th>
				<th field="so_tc_dk">Số TC Điều Kiện</th>
				<th field="ten_day_du">Chương Trình Giảng Dạy</th>
				<th field="ten_lkkt">Loại Khối Kiến Thức</th>
			</tr>
		</thead>
	</table>
	
	<div id="tb" style="padding:5px">
		<div style="padding:5px">
			<div class="fitem">
				<input id="id_ctgd" name="id_ctgd" class="easyui-combobox" style="width: 320px; height: 25px;"
				 	data-options="
					 			  url:'view/loadCTGD.jsp',
					              valueField:'id',
					              textField:'ten',
					              panelHeight:'250'
								  "/>
				<a href="#" class="easyui-linkbutton" plain="true">Chọn CTGD</a>
			</div>
			<input class="search" id="searchTen" name="searchTen" type="text" placeholder="nhập tên chương trình giảng dạy">
			<a href="#" class="easyui-linkbutton" plain="true" iconCls="icon-searchs" onclick="searchObject()">Tìm Kiếm</a>
		</div>
	</div>
</body>
</html>